<template>
	<view class="login-page">
		<div>
			<h2>登录</h2>
			<input v-model="username" type="text" placeholder="请输入账号" />
			<input v-model="password" type="password" placeholder="请输入密码" />
			<button @click="login">登录</button>
			<button @click="switchToRegister">注册</button>
		</div>

		<div v-if="showRegister">
			<h2>注册</h2>
			<input v-model="newUsername" type="text" placeholder="请输入新账号" />
			<input v-model="newPassword" type="password" placeholder="请输入新密码" />
			<input v-model="newPasswordAgain" type="password" placeholder="请再次输入新密码" />
			<button @click="register">注册</button>
			<button @click="switchToLogin">返回登录</button>
		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				username: '',
				password: '',
				newUsername: '',
				newPassword: '',
				newPasswordAgain: '',
				showRegister: false
			};
		},
		methods: {
			login() {
				// 处理登录逻辑
				// 检查账号密码是否正确
				// 如果正确则登录，否则提示错误信息
			},
			register() {
				// 处理注册逻辑
				// 创建新账号并进行相关操作
			},
			switchToRegister() {
				this.showRegister = true;
			},
			switchToLogin() {
				this.showRegister = false;
			}
		}
	};
</script>

<style scoped>
	.login-page {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	input,
	button {
		margin: 10px;
		padding: 5px;
	}
</style>